<template>
  <div>

      <el-tabs v-if="$route.name!='shopsEdit'" v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="已通过" name="shopsList"></el-tab-pane>
        <el-tab-pane label="待审核" name="shopsApplyList"></el-tab-pane>
        <el-tab-pane label="拒绝记录" name="shopsRefuseList"></el-tab-pane>


      </el-tabs>
    <router-view></router-view>
  </div>
  <!--全局keeplive在嵌套路由不生效-->

</template>

<script>
  import Vue from 'vue'

  export default{
    name: "shopsIndex",
    components: {

    },
    data(){
      return{
        activeName:''
      }
    },
    computed:{
    },
    beforeRouteUpdate(to, from, next) {
      console.log(to, from, next)
      if (to.query.status && to.query.status == 'refuse') {
        this.activeName = 'shopsRefuseList'
      } else {
        this.activeName = to.name;

      }
      next();
    },
    mounted() {
      if (this.$route.query.status && this.$route.query.status == 'refuse') {
        this.activeName = 'shopsRefuseList'
      } else {
        this.activeName = this.$route.name;

      }


    },


    methods: {

      handleClick:function(vm){
        if (this.activeName === 'shopsApplyList') {
          this.$router.replace({
            name: `shopsApplyList`,
            query: {status: 'wait'}
          })

        } else if (this.activeName === 'shopsRefuseList') {
          this.$router.replace({
            name: `shopsApplyList`,
            query: {status: 'refuse'}
          })
        } else {
          this.$router.replace({name: this.activeName})

        }

      },


    }

  }
</script>
